<template>
  <div class="wrapper">
    <div id="two" style="width: 100%; height: 100%"></div>
  </div>
</template>

<script>
// import * as echarts from "echarts";
// import $ from "jquery";
// export default {
//   name: "Leftone",
//   data() {
//     return {
//       option1: [],
//     };
//   },
//   mounted() {
//     let that = this;
//     $.ajax({
//       url: `https://view.inews.qq.com/g2/getOnsInfo?name=disease_foreign`,
//       dataType: "jsonp",
//       jsonpCallback: "cb", //也可跟后端约定函数名
//       success(res) {
//         console.log("ajax数据111", res);

//         let foreinData = JSON.parse(res.data);
//         console.log("ajax数据111", JSON.parse(res.data));

//         // const myChart = echarts.init(chartDom);

//         //调用第1个数据
//         const option1 = that.getList(foreinData.countryAddConfirmRankList);
//         const chartDom = document.getElementById("two");
//         that.addChart(chartDom, option1);
//       },
//     });
//   },
//   methods: {
//     //统一初始化echarts方法
//     addChart(dom, option) {
//       const myChart = echarts.init(dom);
//       myChart.setOption(option);
//       //页面改变大小时,echarts也跟随改变
//       window.addEventListener("resize", function () {
//         myChart.resize();
//       });
//       return myChart;
//     },
//     getList(countryAddConfirmRankList) {
//       // 基于准备好的dom，初始化echarts实例
//       let xAxis = [];
//       let yAxis = [];
//       var min = 50;
//       console.log(countryAddConfirmRankList, "Minute");
//       for (let val of countryAddConfirmRankList) {
//         xAxis.push(val.nation);
//         yAxis.push(val.addConfirm);
//       }
//       let option1 = {
//         color: ["#2f89cf"],
//         tooltip: {
//           trigger: "axis",
//           axisPointer: {
//             // 坐标轴指示器，坐标轴触发有效
//             type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
//           },
//         },
//         // 修改图表的大小
//         grid: {
//           left: "0%",
//           top: "10px",
//           right: "3%",
//           bottom: "4%",
//           containLabel: true,
//         },
//         xAxis: [
//           {
//             type: "category",
//             data: xAxis,
//             axisTick: {
//               alignWithLabel: true,
//             },
//             // 修改刻度标签 相关样式
//             axisLabel: {
//               color: "rgba(255,255,255,.6) ",
//               fontSize: "10",
//             },
//             // 不显示x坐标轴的样式
//             axisLine: {
//               show: false,
//             },
//           },
//         ],
//         yAxis: [
//           {
//             type: "value",
//             // 修改刻度标签 相关样式
//             axisLabel: {
//               color: "rgba(255,255,255,.6) ",
//               fontSize: 10,
//             },
//             // y轴的线条改为了2像素
//             axisLine: {
//               lineStyle: {
//                 color: "rgba(255,255,255,.1)",
//                 width: 2,
//               },
//             },
//             // y轴分割线的颜色
//             splitLine: {
//               lineStyle: {
//                 color: "rgba(255,255,255,.1)",
//               },
//             },
//           },
//         ],
//         series: [
//           {
//             name: "新增确诊",
//             type: "bar",
//             data: yAxis,
//             barWidth: "35%",
//             itemStyle: {
//               barBorderRadius: 5,
//             },
//           },
//         ],
//       };
//       return option1;
//     },
//   },
// };
</script>

<style lang="scss" scoped>
.wrapper {
  width: 100%;
  height: 100%;
}
</style>